<div data-extend-template="layouts/partials/table.html">
  <div data-block="search">
    <input type="text"
           class="form-control"
           placeholder="{{ 'Filter' | translate }}"
           ng-model="dockerTagFilter"/>
  </div>

  <div data-block="list-actions">
    <button type="button" class="btn btn-default"
            ng-click="addRule()"
            ng-hide="denied('edit_content_views', contentView)">
      <span translate>Add Rule</span>
    </button>

    <button type="button" class="btn btn-default"
            ng-disabled="table.numSelected === 0"
            ng-hide="denied('edit_content_views', contentView)"
            ng-click="removeRules(filter)">
      <span translate>Remove Tags</span>
    </button>
  </div>

  <span data-block="no-rows-message" translate>
     Create a rule using the add button above.
  </span>

  <div data-block="table">
    <table class="table table-bordered table-striped">
      <thead>
        <tr bst-table-head row-select>
          <th translate>{{ filter.inclusion | filterType }} Tag</th>
          <th></th>
        </tr>
      </thead>

      <tbody>
        <tr bst-table-row ng-repeat="rule in table.rows | filter:dockerTagFilter" row-select="rule">
          <td bst-table-cell>
            <input class="form-control"
                   ng-hide="denied('edit_content_views', contentView)"
                   ng-model="rule.name"
                   uib-typeahead="name for name in fetchAutocompleteName($viewValue)"
                   ng-readonly="!rule.editMode"/>
          </td>

          <td bst-table-cell class="action-cell">
            <button type="button" class="btn btn-default" ng-click="rule.editMode = true; backupPrevious(rule)" ng-hide="rule.editMode">
              <span translate>Edit</span>
            </button>

            <button bst-save-control
                    on-cancel="restorePrevious(rule); rule.editMode = false"
                    on-save="saveRule(rule)"
                    working="rule.working"
                    invalid="!valid(rule)"
                    ng-show="rule.editMode">
            </button>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

